<template>
	<view class="content">
		<view class="flex flex-col justify-start items-center">
			<view class="flex flex-row justify-between items-center w100">
				<view class="flex flex-row items-center justify-start w300">
					<text class="f_32 c_6">姓名</text>
					<text class="orange f_32">*</text>
				</view>
				
				<view class="mright">
					<input type="text" value=""  v-model="title" placeholder="请输入姓名"/>
				</view>
				
			</view>
			
			
			<view class="flex flex-row justify-between items-center w100 ">
					<view class="flex flex-row items-center justify-start w300">
						<text class="f_32 c_6">电话</text>
						<text class="orange f_32">*</text>
					</view>
					<view class="mright">
						<input type="text" value=""  v-model="phone" placeholder="请填写手机号"/>
					</view>
					
				</view>
			<view class="flex flex-row justify-between items-center w100 ">
					<view class="flex flex-row items-center justify-start w300">
						<text class="f_32 c_6">地址</text>
						<text class="orange f_32">*</text>
					</view>
					<view class="mright">
						<input type="text" value=""  v-model="address" placeholder="请填写联系地址"/>
					</view>
					
				</view>
			<view class="flex flex-row justify-between items-center w100">
				<view class="flex flex-row items-center justify-start w200">
					<text class="f_32 c_6">帮办类型</text>
					<text class="orange f_32">*</text>
				</view>
				
			<view class="mright flex flex-row justify-between" style="width: 450rpx;">
				<picker :value="sheshiValue" :range="arr"  @change="chooseHobby">
					<view class="mright flex flex-row justify-between" style="width: 450rpx;">
						<text>{{sheshiValue?arr[sheshiValue]:'请选择帮办类型'}}</text>
				
					<u-icon name="arrow-right"></u-icon>
					</view>
				</picker>

				
			</view>
				
			</view>
		
			<view class="flex flex-row justify-between items-center w100">
				<view class="flex flex-row items-center justify-start w300">
					<text class="f_32 c_6">办理时间</text>
					<text class="orange f_32">*</text>
				</view>
			<view class="mright flex flex-row justify-between" @click="opentime(0)">
				<text style="margin-right: 5rpx;">{{startTime?startTime:'请选择开始时间'}} </text>
				<u-icon name="arrow-right"></u-icon>
			</view>
				
			</view>
		
		
			
				
			
			
		</view>
		<lingfeng-timepicker ref="timePop" type="datetime-all" :defaultData="dateTimeAllRangeDefault" :minDate="minDate" :maxDate="maxDate" @change="timeChange"></lingfeng-timepicker>
		
		<view class="fixedbtn flex flex-row justify-between  u-fixed-bottom">
		
		  <view class="btn background_blue" :class="{'mb_20': !isIPhoneX}" @click="sub_draw">
		    提交</view>
		
		
		</view>
	</view>
</template>

<script>
	
	import {getFormatDate,getFormatDatenow} from "@/common/js/util.js";
		
	import http from 'common/js/http.js';
	export default {
		mixins:[http],
		data() {
			const [year,month,date]=getFormatDate().split("-");
			const [year1,month2,date2,hour2,minute2,second2]=getFormatDatenow().split("-");
			
			return {
				type:0, //0 开始  1 结束
				pickerType:'datetime-all',
				isIPhoneX: this.isIPhoneX,
				startTime:'',
				endTime:"",
			name:'',
			title:'',
			people:'',
			phone:'',
			address:'',
			dateTimeDefault:{
				startTime:year+'-'+month+'-'+date
			},
			sheshiValue:'',
			
			arr:[
				'行政审批',
				'公共服务',
				'日常便民',
				'文化娱乐',
				'教育培训',
				'健康养生',
				'其他'
			],
			dateDefault:{
				year:year,
				month:year+'-'+month,
				startTime:year+'-'+month+'-'+date
			},
			dateTimeAllRangeDefault:{
				startTime:getFormatDatenow() ,
			//	endTime:'2023-03-20 18:00:00',
			},
			minDate:{
				year: year1,
				month: month2,
				date: date2,
				hour:hour2,
				minute:minute2,
				second:second2
			},
			maxDate:{
				year: 2026,
				month: 1,
				date: 1,
				hour:0,
				minute:0,
				second:0
			},
			}
		},
		onLoad() {
		
		},
		onShow() {
		this.getdat()	
		},
		methods: {
			sub_draw(){
				if(this.title==''){
					this.$util.showToast({
						title:'请填写姓名'
					})
					return
				}
				if(this.phone==''){
					this.$util.showToast({
						title:'请填写手机号'
					})
					return
				}
				if(this.address==''){
					this.$util.showToast({
						title:'请填写地址'
					})
					return
				}
				if(this.sheshiValue==''){
					this.$util.showToast({
						title:'请选择帮办类型'
					})
					return
				}
				
				if(this.startTime==''){
					this.$util.showToast({
						title:'请选择帮办时间'
					})
					return
				}
				
				
				uni.showLoading()
				this.sendRequest({
					url:'cun/addbang',
					data:{
						token:uni.getStorageSync('token'),
						town_id:1,
						titile:this.title,
						mobile:this.phone,
						date:this.startTime,
						type:this.sheshiValue,
						address:this.address
					},
					success:res=>{
						uni.hideLoading()
						
						if (res.code == 1) {
											
								this.$util.showToast({
									title: '提交成功!'
								})
								
							
							setTimeout(e => {
								
								uni.navigateBack()
							}, 1500)
						
						}else{
							this.$util.showToast({
								title: res.msg
							})
						
						}
					},
					
				})
			},
			getdat(val){
				let num = 0
				if(val){
					val=String(val).replace(/-/g, '/');
				}
				let date = isNaN(Date.parse(val)) ? new Date(new Date().getTime() + num * 8.64e7) : new Date(new Date(val).getTime() +
					num * 8.64e7);
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();
				let hours = date.getHours();
				let minutes = date.getMinutes();
				let seconds = date.getSeconds();
				month = month < 10 ? "0" + month : month;
				day = day < 10 ? "0" + day : day;
				hours = hours < 10 ? "0" + hours : hours;
				minutes = minutes < 10 ? "0" + minutes : minutes;
				seconds = seconds < 10 ? "0" + seconds : seconds;
				this.minDate={
					year: year,
					month: month,
					date: day,
					hour:hours,
					minute:minutes,
					second:seconds
				}
				console.log(day)
				//return year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds;
			},
			chooseHobby(e){
				this.sheshiValue = e.detail.value
			},
			opentime(e){
				this.type = e
				this.$refs.timePop.show();	
			},
				timeChange(val){
					console.log(val)
					if(this.type==0){
						this.startTime = val
					}else{
						this.endTime = val
					}
					//this.datevak = val
				}
		
		}
	}
</script>

<style lang="scss">
	.w100{
		background: #fff;
		border-bottom: 1rpx solid #f9f9f9;
		padding: 30rpx 20rpx;
	}
	.content{
		width: 100%;
		box-sizing: border-box;
		padding: 20rpx 0;
	}
	.orange{
		margin-left:  10rpx;
	}
	.w200{
		width: 200rpx;
	}
	.w320{
		width: 360rpx;
	}
	.mright{
		width: 500rpx;
	}
	.w300{
		width: 290rpx;
	}
</style>